<template>
  <view>
    <Header></Header>
    <Banner
      @enlarge="buyCoupon"
      :List="swiperList"
      :heights="450"
      :height="460"
    ></Banner>
    <Menu ref="menu"></Menu>
    <div class="place"></div>
    <Activity :activity="AllActivity" :title="true"></Activity>
  </view>
</template>

<script>
import { getActivity, getBanner, getAliUserInfo, aliPay } from '@/api'
import Header from './component/header'
import Banner from '@/components/banner'
import Menu from './component/menu'
import Activity from '@/components/active'

export default {
  components: {
    Header,
    Banner,
    Menu,
    Activity
  },
  data() {
    return {
      swiperList: [],
      AllActivity: []
    }
  },
  created() {
    this.getHomeData()
  },
  onShareAppMessage() {
    return {
      path: '/pages/home/index'
    }
  },
  onShow() {
    this.$nextTick(() => {
      this.$refs.menu.startMove()
    })
  },
  onHide() {
    this.$refs.menu.stopMove()
  },

  methods: {
    buyCoupon(index) {
      if (index === 1) {
        uni.navigateTo({
          url: '/pages/package/hot-cake/index'
        })
      }
    },
    luckDraw() {
      uni.navigateTo({
        url: '/components/luck-draw/index'
      })
    },
    getHomeData() {
      getBanner().then(res => {
        this.swiperList = res.data
      })

      getActivity().then(res => {
        this.AllActivity = res.data
      })
    }
  }
}
</script>

<style lang="less" scoped>
.place {
  height: 20rpx;
  width: 100vw;
  background: #f5f5f5;
}
.btn {
  width: 100vw;
  height: 100%;
  position: fixed;
  overflow-y: scroll;
  background: #000;
  top: 0;
  left: 0;
  // background: transparent;
  z-index: 999;
}
</style>
